<script>
    $(function () {
        $('[data-toggle="tooltip"]').tooltip()
    })
</script>
<div class="page-content">
    <div class="alert {{alert.type}} col-xs-12" ng-show="alert.isShow">
        <strong>{{alert.msg}}</strong>
    </div>
    <div class="col-xs-12">
        <form class="form-vertical" ng-keypress="enterPress($event)">
            <!--<div class="col-sm-11">-->
            <label class="col-sm-1 inputFloat control-label textRight">任务组:</label>

            <div class="col-sm-2">
                <select class="width-80" name="taskGroup" ng-model="jobGroup"
                        ng-options="group.ID as group.Text for group in taskGroupOptions">
                </select>
            </div>
            <label class="col-sm-1 inputFloat control-label textRight">优先级:</label>

            <div class="col-sm-2">
                <select class="width-80" name="taskGroup" ng-model="jobPriority"
                        ng-options="pri.ID as pri.Text for pri in priorityOptions">
                </select>
            </div>

            <label class="col-sm-1 inputFloat control-label textRight">开发者:</label>

            <div class="col-sm-2">
                <span class="block input-icon input-icon-right">
                    <input type="text" ng-model="jobDeveloper"
                           placeholder="不限"
                           title="支持模糊查询"
                           typeahead=" developer as developer.Text for developer in developers"
                           class="width-80">
                </span>
            </div>

            <label class="col-sm-1 inputFloat control-label textRight">任务名/ID:</label>

            <div class="col-sm-2">
                <span class="block input-icon input-icon-right">
                    <input type="text" ng-model="jobID" class="width-80" placeholder="模糊查询">
                </span>
            </div>


        </form>
        <div class="col-xs-12">
            <button class="col-sm-1 btn btn-primary btn-sm pull-right" ng-disabled="isLoading" type="button"
                    ng-click="submitQuery()">
                <i class="icon-search"></i>查询
            </button>
        </div>
    </div>


    <div class="col-xs-12 text-center" ng-show="isLoading">
        <div id="loading" class="loading " style="color: #000000;width: auto">载入中</div>
    </div>

    <div class="col-xs-12" ng-hide="hideTable" id="jobManagerTable" style="padding-top: 10px">
        <div class="table-header">查询结果</div>
        <div class="table-responsive">
            <div class="dataTables_wrapper jobTooltip" role="grid">
                <div class="row">
                    <div class="col-sm-7">
                        <div class="dataTables_length">
                            <label>每页显示
                                <select ng-model="table.selectedRecordPerPage"
                                        ng-options="rpp for rpp in table.recordPerPageOptions" required>
                                </select> 条记录
                            </label>
                        </div>
                    </div>


                    <div class="col-sm-3">
                        <div class="dataTables_filter">
                            <label>过滤: <input type="text" ng-model="table.query"></label>
                        </div>
                    </div>
                    <div class="col-sm-2">
                        <label>是否有效:</label>
                        <label>
                            <input name="switch-field-1" class="ace ace-switch ace-switch-2" type="checkbox"
                                   ng-model="isValid" ng-change="handleValid()">
                            <span class="lbl"></span>
                        </label>
                    </div>
                </div>
                <table class="table table-striped table-bordered table-hover dataTable">
                    <thead>
                    <tr role="row">
                        <th class="{{table.getSortingClass('taskGroupId')}}"
                            ng-click="table.predicate = 'taskGroupId'; table.reverse=!table.reverse">任务组
                        </th>

                        <th class="{{table.getSortingClass('taskId')}}"
                            ng-click="table.predicate = 'taskId'; table.reverse=!table.reverse">任务ID
                        </th>
                        <th class="{{table.getSortingClass('priority')}}"
                            ng-click="table.predicate = 'priority'; table.reverse=!table.reverse">优先级
                        </th>
                        <th class="{{table.getSortingClass('taskName')}}"
                            ng-click="table.predicate = 'taskName'; table.reverse=!table.reverse">任务名
                        </th>
                        <th class="{{table.getSortingClass('owner')}}"
                            ng-click="table.predicate = 'owner'; table.reverse=!table.reverse">开发者
                        </th>
                        <th class="{{table.getSortingClass('cycle')}}"
                            ng-click="table.predicate = 'cycle'; table.reverse=!table.reverse">周期
                        </th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr ng-repeat="job in table.displayedDataList.slice(table.startIndex-1, table.endIndex)">
                        <td style="vertical-align: middle;">
                            <span class="{{getTaskGroupCss(job.taskGroupId)}}" >
                                <strong>{{getGroupIdText(job.taskGroupId)}}</strong>
                            </span>
                        </td>
                        <td style="vertical-align:middle">{{job.taskId}}</td>
                        <td style="vertical-align: middle">{{mapPriority(job.priority)}}</td>
                        <td style="vertical-align:middle">{{job.taskName}}</td>
                        <td style="vertical-align:middle">{{job.owner}}</td>
                        <td style="vertical-align:middle">
                            <span class="label {{getExecutionCycleLabel(job.cycle)}} ">
                                {{getCycleText(job.cycle)}}
                            </span>
                        </td>
                        <td>
                            <div class="">
                                <button class="btn-link green" ng-click="editJob($index)"
                                        title="编辑" bs-tooltip>
                                    <i class="icon-pencil bigger-130"></i>
                                    <!--<span>编辑</span>-->
                                </button>
                                <button class="btn-link green" ng-click="preRunJob($index)"
                                        title="手动运行" bs-tooltip>
                                    <i class="icon-forward bigger-130"></i>
                                    <!--<span>手动运行</span>-->
                                </button>
                                <button class="btn-link " ng-click="invalidJob($index)"
                                        title="下线"
                                        ng-show="isValid==true" bs-tooltip>
                                    <i class="icon-pause bigger-130"></i>
                                    <!--<span>下线</span>-->
                                </button>
                                <button class="btn-link " ng-click="validateJob($index)"
                                        title="上线"
                                        ng-show="isValid==false" bs-tooltip>
                                    <i class="icon-pause bigger-130"></i>
                                    <!--<span>上线</span>-->
                                </button>
                                <button class="btn-link " ng-click="setJobMonitor($index)"
                                        title="监控配置"
                                        ng-show="isValid&&job.type==1" bs-tooltip>
                                    <i class="icon-eye-open bigger-130"></i>
                                    <!--<span>上线</span>-->
                                </button>
                                <button class="btn-link red" ng-click="deleteJob($index)"
                                        title="删除"
                                        ng-show="isValid==false" bs-tooltip>
                                    <i class="icon-remove bigger-130"></i>
                                    <!--<span>删除</span>-->
                                </button>

                            </div>
                        </td>
                    </tr>
                    </tbody>
                </table>

                <div class="row">
                    <div class="col-sm-5">
                        <div class="dataTables_info">
                            展示第{{table.startIndex}}条记录至第{{table.endIndex}}条记录（总计{{table.total}}条记录）
                        </div>
                    </div>
                    <div class="col-sm-7">
                        <div class="dataTables_paginate paging_bootstrap">
                            <ul class="pagination">
                                <li class="{{table.getDisableLabelforPrevious()}}"><a href=""
                                                                                      ng-click="table.gotoFirstPage()"><i
                                        class="icon-double-angle-left"></i></a></li>
                                <li class="{{table.getDisableLabelforPrevious()}}"><a href=""
                                                                                      ng-click="table.previousPage()"><i
                                        class="icon-angle-left"></i></a></li>
                                <li ng-repeat="num in table.getCurrentPageNumDisplay()"
                                    class="{{table.getActiveLabel(num)}}">
                                    <a href="" ng-click="table.changePage(num)">{{num}}</a>
                                </li>
                                <li class="{{table.getDisableLabelforNext()}}"><a href="" ng-click="table.nextPage()"><i
                                        class="icon-angle-right"></i></a></li>
                                <li class="{{table.getDisableLabelforNext()}}"><a href=""
                                                                                  ng-click="table.gotoLastPage()"><i
                                        class="icon-double-angle-right"></i></a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


